<videojs>
<div data-vjs-player class="video-player-container">
  <video ref="videoPlayer" class="video-js vjs-big-play-centered">
  	<source src={opts.source.src} type={opts.source.type} withCredentials={opts.source.withCredentials}/>
  </video>
</div>
<script>
	let tag = this;

	tag.on('mount', function() {
		switch (tag.opts.source.type) {
			case 'stream':
				tag.refs.videoPlayer.src = window.URL.createObjectURL(tag.opts.source.src);
				tag.refs.videoPlayer.style.width = '100%';


				tag.refs.videoPlayer.style.height = tag.root.style.width / 1.33,
					tag.refs.videoPlayer.play();
				break;
			default:
				tag.player = videojs(tag.refs.videoPlayer, {
					autoplay: false,
					controls: true,
					preload: 'auto',
					//loop: true,
					height: tag.opts.height || tag.root.offsetWidth / 1.33,
					//poster: require('../images/player.poster.1.png'),
					techOrder: ['html5', 'flash']
				}, () => {});
		}
	});

	tag.on('before-unmount', function() {
		if (tag.player) {
			tag.player.dispose();
		}
	});
</script>
<style>
:scope{
	display: block;
}
	:scope .video-player-container{
		max-width: 100%;
	}
	:scope .vjs-channel-info{
		position: absolute;
		right: 0;
		margin: 5px 5px 0 0;
	}
</style>
	
</videojs>